<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>客户管理子页面</title>
    <link rel="stylesheet" href="http://static-online.zhaogangtest.com/publicresource/css/bootstrap-table.css">
    <link rel="stylesheet" href="../../../resources/public/css/table.css">
    <link rel="stylesheet" href="../../../resources/public/css/bootstrap-table-fixed-columns.css">
    <link rel="stylesheet" href="http://static-online.zhaogangtest.com/publicresource/control/daterangpicker/daterangepicker-bs3.css">
    <link rel="stylesheet" href="../../../resources/public/css/iconfont.min.css">
    <link rel="stylesheet" href="../../../resources/public/css/scmstrap.css">
    <link rel="stylesheet" href="http://static-online.zhaogangmit.com/project/ued/otwb/local/resources/css/iviewer.css">
</head>

<body>
    <div class="main">
        <div class="tab tab-spire">
            <ul>
                <li class="active">
                    <a href="javascript:;">
                        基本信息
                    </a>
                </li>
                <li>
                    <a href="javascript:;">
                        结算方式
                    </a>
                </li>
                <li>
                    <a href="javascript:;">
                        开票资料
                    </a>
                </li>
            </ul>
        </div>
        <div class="tab-content">
            <div class="tab-content-inner page-paddingbtm">
                <div class="tab">
                    <ul>
                        <li class='active'>
                            <a href="javascript:;">
                            基本信息
                        </a>
                        </li>
                    </ul>
                </div>
                <div class="box-detail">
                    <table>
                        <tbody>
                            <tr>
                                <th width="20%">公司名称：</th>
                                <td width="30%">
                                    <!-- <span class='blue'> -->上海找钢网信息科技股份有限公司
                                    <!-- </span> -->
                                </td>
                                <th width="20%">证件类型：</th>
                                <td width="30%">
                                    非三证合一
                                </td>
                            </tr>
                            <tr>
                                <th>联系人：</th>
                                <td>
                                    费文杰
                                </td>
                                <th>联系方式：</th>
                                <td>
                                    1300000004
                                </td>
                            </tr>
                            <tr>
                                <th>交易员：</th>
                                <td>
                                    朱玲玲
                                </td>
                                <!-- <th>卖家</th>
                                <td>
                                    上海长城实业有限公司
                                </td> -->
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="tab">
                    <ul>
                        <li class='active'>
                            <a href="javascript:;">
                            企业信息
                        </a>
                        </li>
                    </ul>
                </div>
                <div class="box-detail">
                    <table>
                        <tbody>
                            <tr>
                                <th width="11%">营业执照附件：</th>
                                <td width="22%" align="center">
                                    <div class="img-parent">
                                        <div class="img-wrap">
                                            <dl>
                                                <dt>
                                                    <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534496399029&di=23bd8ea53b56f03689bc1642db608e6e&imgtype=0&src=http%3A%2F%2Fwww.rar8.net%2FSoft%2FUploadSoft%2F201709%2F2017091210533379.jpg" alt="">
                                                </dt>
                                                <dd></dd>
                                            </dl>
                                        </div>
                                    </div>
                                </td>
                                <th width="11%">组织机构代码证附件:</th>
                                <td width="22%" align="center">
                                    <div class="img-parent">
                                        <div class="img-wrap">
                                            <dl>
                                                <dt>
                                                    <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534496727738&di=2f3bb466f1dcccd854c2ed808025c340&imgtype=0&src=http%3A%2F%2Fdesk.fd.zol-img.com.cn%2Ft_s960x600c5%2Fg5%2FM00%2F0B%2F06%2FChMkJ1cghZGIbfOAAARV4Pwpv4QAAQsDQJ9YssABFX4485.jpg" alt="">
                                                </dt>
                                                <dd></dd>
                                            </dl>
                                        </div>
                                    </div>
                                </td>
                                <th width="11%" rowspan="2">税务登记证附件:</th>
                                <td width="22%" rowspan="2" align="center">
                                    <!-- <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534496769159&di=4ec433a6bce3f42818cae2443dffa5b9&imgtype=0&src=http%3A%2F%2Fimg.tuwandata.com%2Fv2%2Fthumb%2Fall%2FOGYxOSwxMDAwLDEwMCw0LDMsMSwtMSwxLA%3D%3D%2Fu%2Fwww.tuwan.com%2Fuploads%2Fallimg%2F1504%2F25%2F1323125928-4.jpg" alt=""> -->
                                    <div class="img-parent">
                                        <div class="img-wrap">
                                            <dl>
                                                <dt>
                                                    <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534496769159&di=4ec433a6bce3f42818cae2443dffa5b9&imgtype=0&src=http%3A%2F%2Fimg.tuwandata.com%2Fv2%2Fthumb%2Fall%2FOGYxOSwxMDAwLDEwMCw0LDMsMSwtMSwxLA%3D%3D%2Fu%2Fwww.tuwan.com%2Fuploads%2Fallimg%2F1504%2F25%2F1323125928-4.jpg" alt="">
                                                </dt>
                                                <dd></dd>
                                            </dl>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <th>有效期&nbsp;<b class="must">*</b>:</th>
                                <td>
                                    <div class="form-list form-list-btn-inner nofloat">
                                        <div class="group group-data">
                                            <!-- <label class="table-center-label">创建时间</label> -->
                                            <div class="scm-input-wrap">
                                                <i class="anticon icon-calendar"></i>
                                                <input type="text" class="scm-input active" id="datepicker" placeholder="选择有效期">
                                            </div>
                                        </div>
                                        <div class="group">
                                            <!-- <label class="table-center-label">库位状态</label> -->
                                            <div class="scm-input-wrap mycheckradioall">
                                                <label class="mycheckradio radio-popup-style active"><em></em>非永久</label>
                                                <label class="mycheckradio radio-popup-style"><em></em>永久</label>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <th>有效期&nbsp;<b class="must">*</b>:</th>
                                <td>
                                    <div class="form-list form-list-btn-inner nofloat">
                                        <div class="section-inner-number">
                                            <div class="group form-group">
                                                <!-- <label class="table-center-label">
                                            <b>*</b>组织机构代码
                                        </label> -->
                                                <div class="scm-input-wrap">
                                                    <i class="anticon icon-calendar"></i>
                                                    <input type="text" class="scm-input active" id="datepicker1" placeholder="选择有效期">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="tab">
                    <ul>
                        <li class='active'>
                            <a href="javascript:;">
                            实名认证
                        </a>
                        </li>
                    </ul>
                </div>
                <div class="box-detail">
                    <table class="table-special-style">
                        <tbody>
                            <tr>
                                <th width="30%">实名认证授权书附件&nbsp;<b class="must">*</b>:</th>
                                <td width="70%" align="center">
                                    <div class="img-parent">
                                        <div class="img-wrap">
                                            <dl>
                                                <dt>
                                                    <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534500001692&di=4334f6da42261accbbab3426d73dc1a9&imgtype=0&src=http%3A%2F%2Fa.hiphotos.baidu.com%2Fzhidao%2Fwh%253D680%252C800%2Fsign%3D31821732da1373f0f56a67999c3f67c3%2Fdc54564e9258d109531f26fbda58ccbf6d814dff.jpg" alt="">
                                                </dt>
                                                <dd></dd>
                                            </dl>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <!-- <div class="box-table">
                    <table class="table table-condensed" id="table-offer"></table>
                </div> -->
            </div>
            <div class="tab-content-inner page-paddingbtm" style="display: none">
                <div class="form-list">
                    <div class="group group-form-style" style="width: 100%;">
                        <label>结算方式</label>
                        <div class="scm-input-wrap mycheckradioall">
                            <label class="mycheckradio radio-wide-style active"><em></em>一票制</label>
                            <label class="mycheckradio radio-wide-style"><em></em>内部结算</label>
                            <label class="mycheckradio radio-wide-style showcontent"><em></em>月结按日期</label>
                            <div class="radiocontent-detail nodisplay">
                                <label>每月</label>
                                    <div class="scm-input-wrap" style="width: 8%;">
                                        <input type="text" class="scm-input" value="委托方公司">
                                    </div>
                                <label style="width: 30px;">日</label>
                            </div>
                            <label class="mycheckradio radio-wide-style showcontent2"><em></em>月结按订单</label>
                            <div class="radiocontent-detail2 nodisplay">
                                <label style="width: 130px;">订单确认签收后</label>
                                    <div class="scm-input-wrap" style="width: 8%;">
                                        <input type="text" class="scm-input" value="委托方公司">
                                    </div>
                                <label style="width: 30px;">日</label>
                            </div>
                            <label class="mycheckradio radio-wide-style"><em></em>见票付</label>
                            <label class="mycheckradio radio-wide-style"><em></em>其他</label>
                        </div>
                    </div>
                </div>
                <!-- 按钮 -->
                <div class="operation">
                    <div class="conditionbtn-center">
                        <button class="scm-btn blue">
                            <i class="anticon icon-save"></i>保存</button>
                    </div>
                </div>
            </div>
            <div class="tab-content-inner page-paddingbtm" style="display: none">
                <!-- 按钮 -->
                <div class="operation">
                    <div class="scm-btn-group fr">
                        <button class="scm-btn">
                            <i class="anticon icon-edit1"></i>修改
                        </button>
                    </div>
                </div>
                <!-- <div class="tab">
                    <ul>
                        <li class='active'>
                            <a href="javascript:;">
                             请确保上传的开票资料图片与填写的信息一致，如出现错误财务不能进行开票 
                        </a>
                        </li>
                    </ul>
                </div> -->
                <p class="layer-tips layer-tips-reminder"><i class="anticon icon-exclamationcircle fs17 brown"></i>请确保上传的开票资料图片与填写的信息一致，如出现错误财务不能进行开票</p>
                <div class="box-detail">
                    <table>
                        <tbody>
                            <tr>
                                <th width="20%">纳税人识别号</th>
                                <td width="30%">
                                    <!-- <span class='blue'> -->4324354234543543
                                    <!-- </span> -->
                                </td>
                                <th width="20%">开户行</th>
                                <td width="30%">
                                    中国招商银行
                                </td>
                            </tr>
                            <tr>
                                <th>账号</th>
                                <td>
                                    432344
                                </td>
                                <th>地址</th>
                                <td>
                                    山东省济南市高新区上海市宝山区24号
                                </td>
                            </tr>
                            <tr>
                                <th> 电话 </th>
                                <td>
                                    021-89961256
                                </td>
                                <!-- <th>卖家</th>
                                <td>
                                    上海长城实业有限公司
                                </td> -->
                            </tr>
                        </tbody>
                    </table>
                    <div class="box-detail">
                        <table>
                            <tbody>
                                <tr>
                                    <th width="33%" align="center" class="th-centerstyle">
                                        <div class="img-parent">
                                            <div class="img-wrap">
                                                <dl>
                                                    <dt>
                                                        <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534503690979&di=750f1562a9a487bc98648028e9c523c2&imgtype=0&src=http%3A%2F%2Fs9.rr.itc.cn%2Fr%2FwapChange%2F201612_7_18%2Fa90ia940984114223596.jpeg" alt="">
                                                    </dt>
                                                    <dd></dd>
                                                </dl>
                                            </div>
                                        </div>
                                    </th>
                                    <th width="33%" align="center" class="th-centerstyle">
                                        <div class="img-parent">
                                            <div class="img-wrap">
                                                <dl>
                                                    <dt>
                                                        <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534503792069&di=daa2ca1ea2c286a561fcb407f3758b63&imgtype=0&src=http%3A%2F%2Fimg5.2345.com%2Fduoteimg%2FzixunImg%2Flocal%2F2017%2F04%2F13%2F14920525944713.jpg" alt="">
                                                    </dt>
                                                    <dd></dd>
                                                </dl>
                                            </div>
                                        </div>
                                    </th>
                                    <th width="33%" align="center" class="th-centerstyle">
                                        <div class="img-parent">
                                            <div class="img-wrap">
                                                <dl>
                                                    <dt>
                                                        <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1534503888979&di=0decc7cdcb560e4a5edbfdbb72724480&imgtype=0&src=http%3A%2F%2Fimg17.3lian.com%2Fd%2Ffile%2F201702%2F08%2F4972db13f75df2df2446259945029d0d.jpg" alt="">
                                                    </dt>
                                                    <dd></dd>
                                                </dl>
                                            </div>
                                        </div>
                                    </th>
                                </tr>
                                <tr>
                                    <td align="center">一般纳税人证明</td>
                                    <td align="center">开票资料</td>
                                    <td align="center">特殊说明</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 查看图片 -->
    <div class="fjLayer" style="display: none">
        <div id="viewer" class="viewer"></div>
        <div class="bottomBlack"></div>
        <div id="iviewer_prev"></div>
        <div id="iviewer_next"></div>
        <div id="iviewer_count"><i class="cur"></i>/<i class="all"></i></div>
    </div>
    <script src="http://static-online.zhaogangtest.com/publicresource/js/require.js"></script>
    <script>
    var page;

    require.config({
        paths: {
            "jquery": "../../../resources/public/js/jquery.min",
            "bootstrap": 'http://static-online.zhaogangtest.com/publicresource/js/bootstrap.min',
            // "bootstrap-table": "http://static-online.zhaogangtest.com/publicresource/js/bootstrap-table",
            "bootstrap-table": "../../../resources/public/js/bootstrap-table",
            "moment": "http://static-online.zhaogangtest.com/publicresource/control/daterangpicker/moment.min",
            "daterangepicker": "../../../resources/public/js/daterangepicker",
            "layer": 'http://static-online.zhaogangtest.com/publicresource/control/layer/layer.min',
            "public": "../../../resources/public/js/public",
            "chinese": "../../../resources/public/js/chinese",
            "bootstrap-table-fixed": "../../../resources/public/js/bootstrap-table-fixed-columns",
            "autocomplete": "../../../resources/public/js/jquery.autocomplete",
            "iviewer": "http://static-online.zhaogangmit.com/project/ued/otwb/local/resources/js/jquery.iviewer",
            "mousewheel": "http://static-online.zhaogangmit.com/project/ued/otwb/local/resources/js/jquery.mousewheel.min",
        },
        shim: {
            "jquery": {
                exports: ['jQuery', '$']
            },
            "bootstrap": {
                deps: ["jquery"]
            },
            "bootstrap-table": {
                deps: ["jquery", "bootstrap"]
            },
            "bootstrap-table-fixed": {
                deps: ["bootstrap-table"]
            },
            "layer": {
                deps: ["jquery"],
                exports: "layer"
            },
            "autocomplete": {
                deps: ['jquery']
            },
            "moment": {
                deps: ['jquery']
            },
            "daterangepicker": {
                deps: ["jquery", "moment"],
                exports: "daterangepicker"
            },
            "chinese": {
                deps: ["jquery", "bootstrap-table"],
            },
            "iviewer": {
                deps: ["jquery", "mousewheel"]
            },
            "mousewheel": {
                deps: ["jquery"]
            },

            "public": {
                deps: ["jquery", "bootstrap-table", "moment", "daterangepicker"]
            }
        }
    });
    require(["autocomplete", "public", "layer", "chinese", "bootstrap-table-fixed", "iviewer"], function() {
        layer.config({
            path: 'http://static-online.zhaogangtest.com/publicresource/control/layer/'
        });
        $(function() {
            page = {
                init: function() {
                    this.bootstrapTable();
                    this.autocomplete();
                    this.fn_layer();
                    this.fn_viewImg();
                    this.show_content();

                    var that = this;
                    $(window).resize(function() {
                        $('#table-parent').bootstrapTable('resetView', {
                            height: that.getHeight()
                        });
                        $('.daterangepicker').hide()
                    });
                    $.daterangepicker("#datepicker", {
                        singleDatePicker: true,
                    });
                    $.daterangepicker("#datepicker1", {
                        singleDatePicker: true,
                    });
                    $.daterangepicker("#datepicker2", {
                        singleDatePicker: true,
                    });

                },
                bootstrapTable: function() {
                    $('#table-parent').bootstrapTable({
                        pagination: true, //在表格底部显示分页工具栏
                        pageSize: 50,
                        pageNumber: 1,
                        pageList: [10, 25, 50, 100],
                        height: page.getHeight(),
                        showFooter: true,
                        showColumns: false,
                        showRefresh: false,
                        //                    showToggle:true,
                        search: false,
                        //                    showPaginationSwitch:true,
                        // detailView: true,
                        // detailFormatter: page.showdetail,
                        // detailFormatter: this.showChild,
                        // onExpandRow: this.expandRow,
                        // onCollapseRow: this.collapseRow,
                        locales: 'zh-CN',
                        fixedColumns: false,
                        fixedNumber: 1,
                        url: '../data/erp/tablelist-pricelist-manage-childpage.json',
                        sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）

                        columns: [{
                            "field": "n1",
                            "title": "<b class='must'>*</b>&nbsp;地区",
                        }, {
                            "field": "n2",
                            "title": "<b class='must'>*</b>&nbsp;价格",
                        }, {
                            "field": "n3",
                            "title": "备注",
                        }]
                    });
                },

                show_content: function() {
                    $(document).on('click', '.showcontent', function() {
                        $(".radiocontent-detail").removeClass("nodisplay");
                        $(".radiocontent-detail2").addClass("nodisplay");
                    })
                    $(document).on('click', '.showcontent2', function() {
                        $(".radiocontent-detail2").removeClass("nodisplay");
                        $(".radiocontent-detail").addClass("nodisplay");
                    })
                },


                fn_layer: function() {
                    $(document).on('click', '.btn-adjust-transport', function() {
                        parent.unify.fn_detail('erp/erp-transport-manage-child.html', '修改转运单ZYDD20180711001', '修改转运单ZYDD2018071100')
                    })
                },
                autocomplete: function() {
                    var data = ['上海钢找塑料', '上海钢富信息科技有限技有限公司', '上海找油网信息科技', '上海长城实业有限公司',
                        '上海找油网信息科技', '上海长城实业有限公司'
                    ]
                    $("#company input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                    $("#company1 input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap1',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                    $("#company2 input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap2',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                    $("#company3 input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap3',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                    $("#company4 input").autocomplete({
                        lookup: data,
                        minChars: 0,
                        appendTo: '#companywrap4',
                        onSelect: function(suggestion) {
                            // $(this).val(suggestion.value);
                        },
                    });
                },
                // 表格高度
                getHeight: function() {
                    var _height = $('.form-list').outerHeight(
                        true) + $('.operation').outerHeight(true)
                    return $(window).height() - _height - 20;
                },
                // viewImg
                fn_viewImg: function() {
                    $("#viewer").iviewer({
                        src: "http://static-online.zhaogangtest.com/project/ued/catlogistics/local/Resources/member/images/p1.png"
                    });
                    var honorCur = $('#iviewer_count .cur');
                    var honorAll = $('#iviewer_count .all');
                    var honorPrev = $('#iviewer_prev');
                    var honorNext = $('#iviewer_next');
                    var this_iviewer;

                    function iviewer(that) {
                        var _name = that.find('dd').html() || "预览图片";
                        $('.skin-iviewer .layui-layer-title').html(_name);
                        $('#viewer img').attr('src', that.find('img').attr('src'));
                        honorCur.html(that.index() + 1);
                        honorAll.html(that.parent().find('dl').length);
                    }
                    $(".img-wrap").on("click", "dl", function() {
                        this_iviewer = $(this).parents('.img-wrap').find('dl');
                        iviewer($(this))
                        layer.open({
                            type: 1, //page层
                            area: ['auto', 'auto'],
                            title: $(this).find('dd').html() || "预览图片",
                            shadeClose: false,
                            shade: 0.3, //遮罩透明度
                            moveType: 1, //拖拽风格，0是默认，1是传统拖动
                            shift: -1, //0-6的动画形式，-1不开启
                            content: $('.fjLayer'),
                            skin: "skin-searchMore skin-iviewer",
                            cancel: function(index) {
                                layer.close(index)
                                return false;
                            }
                        })
                    })
                    honorPrev.click(function() {
                        var _n = parseInt(honorCur.html()) - 2;
                        var _a = parseInt(honorAll.html());
                        if (_n == _a) {
                            iviewer(this_iviewer.eq(_a))
                        } else {
                            iviewer(this_iviewer.eq(_n))
                        }
                    })
                    honorNext.click(function() {
                        var _n = parseInt(honorCur.html());
                        var _a = parseInt(honorAll.html());
                        if (_n == _a) {
                            iviewer(this_iviewer.eq(0))
                        } else {
                            iviewer(this_iviewer.eq(_n))
                        }
                    })
                }
            }
            page.init();
        })
    })
    </script>
</body>

</html>